Dear _________,I hope your day is going well! My name is _________, and I'm a _________ at _________. I am very interested in working for _________ next _________. Your commitment to _________ and _________ that I saw on the website inspired me! The products you build and the values you stand for make _________ seem like an ideal workplace for me. A little about me, I [insert relevant work experience, extracurriculars, and projects here]. I think these experiences would make me a great candidate for you. Please let me know if there's anything else you need from me. I look forward to hearing from you! I can be reached at _________ and _________ Best regards,
Curated list of websites and resources to find work programming
O(1)
Runtime is constant and does
not grow with n
O(log n)
Runtime grows logarithmically
in proportion to n
O(n)
Runtime grows directly in
proportion to n
O(n log n)
Runtime grows in proportion and
logarithmically to n
O(n^c)
Runtime grows quicker than
previous all based on n
O(c^n)
Runtime grows even faster than
polynomial growth based on n
O(n!)
Runtime grows the fastest and
becomes quickly unusable for
even
n
n log n
.
O(1), Dynamic array: O(1)
O(n), Dynamic array: O(n)
O(log n), Dynamic array: O(log n)
O(n)
O(n)
O(n)
O(n)
O(1)
O(1)
O(n)
O(1)
O(1)
O(1)
O(log n)
O(log n)
O(log n)
O(n^2)
O(n^2)
O(n^2)
O(1)
O(n^2), in practice it slightly
less since its comparison
scheme only requires checking
place if its smaller than its
neighbor.
O(n)
O(n^2)
O(n^2)
O(n)
O(n log n)
O(n log n)
O(n)
O(1)
O(n^2)
O(n log n)
O(n log n)
O(log n)
alt
attribute on images?
alt
attribute provides alternative
information for an image if a user
cannot view it. The alt
attribute should be used to describe
any images except those which only
serve a decorative purpose, in which
case it should be left empty.
alt
attribute.
alt
tags to understand image
content, so they are
considered important for
Search Engine Optimization
(SEO).
.
at the end of alt
tag to improve
accessibility.
defer
and async
attributes on a <script>
tag?
defer
attribute downloads the script while
the document is still parsing but
waits until the document has finished
parsing before executing it,
equivalent to executing inside a DOMContentLoaded
event listener. defer
scripts will execute in order. The async
attribute downloads the script during
parsing the document but will pause
the parser to execute the script
before it has fully finished parsing. async
scripts will not necessarily execute
in order. Note: both attributes must
only be used if the script has a src
attribute (i.e. not an inline
script).
defer
script in the <head>
allows the browser to download
the script while the page is
still parsing, and is
therefore a better option than
placing the script before the
end of the body.
defer.
async.
defer
if the DOM must be ready and
the contents are not placed
within a DOMContentLoaded
listener.
async
function?
async
function is a function that allows you
to pause the function's execution
while it waits for ( await
s) a promise to resolve. It's an
abstraction on top of the Promise API
that makes asynchronous operations look
like they're synchronous. async
functions automatically return a
Promise object. Whatever you return
from the async
function will be the promise's resolution. If instead you throw
from the body of an async
function, that will be how your async
function rejects
the promise it returns. Most
importantly, async
functions are able to use the await
keyword in their function body, which pauses the function
until the operation after the await
completes, and allows it to return
that operation's result to a
variable synchronously.
async
functions are just syntactic
sugar on top of
Promises.
async
function returns, and reject
to whatever your async
function throws.
batches
that returns the maximum number of
whole batches that can be cooked
from a recipe.
Object.keys()
to return the ingredients of the
recipe as an array, then use Array.prototype.map()
to map each ingredient to the ratio of
available units to the amount required
by the recipe. If one of the
ingredients required by the recipe is
not available at all, the ratio will
evaluate to NaN
, so the logical OR operator can be
used to fallback to 0
in this case. Use the spread ...
operator to feed the array of all the
ingredient ratios into Math.min()
to determine the lowest ratio. Passing
this entire result into Math.floor()
rounds down to return the maximum
number of whole batches.
navbar
is the Block, navbar__link
is an Element that makes no sense
outside of the navbar
component, and navbar__link--active
is a Modifier that indicates a
different state for the navbar__link
Element. Since Modifiers are verbose,
many opt to use is-*
flags instead as modifiers.
1ms
.
1ms
1000ms
1ms <= x <=
1000ms
10000ms
sort()
method and the average time complexity
of quicksort is O(NlgN). This is very
efficient for large collections.
1000000ms
Infinity
(practically) ms
bind
that is functionally equivalent to
the method Function.prototype.bind
.
...
operator. From that function, return
the result of calling the fn
with Function.prototype.apply
to apply the context and the array of
arguments to the function.
src="js/script.js"
=> src="js/script.js?v=2"
async/await
is usually the best option. Instead of
supplying the functions with callbacks
that cause deep nesting, they return a
promise that can be await
ed and will be resolved once the data
has arrived, allowing the next line of
code to be evaluated in a sync-like
fashion. The above code can be
restructured like so:
setState
?
setState
has finished and the component gets
rendered. Since setState
is asynchronous, the callback function
is used for any post action.
setState
finishes and is used for any
post action.
findDOMNode()
API, due to the fact that findDOMNode()
prevents certain improvements in React
in the future.
findDOMNode().
map
function takes a callback function
that is invoked synchronously for each
iteration of the loop (array
element).
children
prop?
children
is part of the props object passed to
components that allows components to
be passed as data to other components,
providing the ability to compose
components cleanly. There are a number
of methods available in the React API
to work with this prop, such as React. Children.map
, React. Children.forEach
, React. Children.count
, React.Children.only
and React. Children.toArray
. A simple usage example of the
children prop is as follows:
className
instead of class
like in HTML?
class
on an element meant using the className
API:
class
can
be used as a prop without problems, as
seen in other libraries like Preact.
React currently allows you to use class
, but will throw a warning and convert
it to className
under the hood. There is currently an
open thread (as of January 2019)
discussing changing className
to class
to reduce confusion.
...
, the object's own enumerable
properties can be copied into the new
object. This creates a shallow clone
of the object.
JSON.parse(JSON.stringify(obj))
can be used to deep-clone a
simple object, but it is
CPU-intensive and only accepts
valid JSON (therefore it
strips functions and does not
allow circular
references).
Object.assign({}, obj)
is another alternative.
Object.keys(obj).reduce((acc,
key) => (acc[key] =
obj[key], acc), {})
is another more verbose
alternative that shows the
concept in greater
depth.
==
or ===
. This is because they are being
compared by their reference (location
in memory), unlike primitive values
which are compared by value. In order
to test if two objects are equal in
structure, a helper function is
required. It will iterate through the
own properties of each object to test
if they have the same values,
including nested objects. Optionally,
the prototypes of the objects may also
be tested for equivalence by passing true
as the 3rd argument. Note: this
technique does not attempt to test
equivalence of data structures other
than plain objects, arrays, functions,
dates and primitive values.
http://mydomain.com
that uses AJAX to make a request for http://yourdomain.com
. For security reasons, browsers
restrict cross-origin HTTP requests
initiated by JavaScript. XMLHttpRequest
and fetch
follow the same-origin policy, meaning
a web application using those APIs can
only request HTTP resources from the
same origin the application was
accessed, unless the response from the
other origin includes the correct CORS
headers.
Content
: The inner-most part of the box
filled with content, such as text, an
image, or video player. It has the
dimensions content-box width
and content-box height
. Padding
: The transparent area surrounding the
content. It has dimensions padding-box width
and padding-box height
. Border
: The area surrounding the padding (if
any) and content. It has dimensions border-box width
and border-box height
. Margin: The transparent outer-most layer
that surrounds the border. It
separates the element from other
elements in the DOM. It has dimensions margin-box width
and margin-box height
.
lighten
, darken
, transparentize
, etc), mixins, and loops that make
CSS more like a real programming
language and gives the developer more
power to generate complex CSS.
~
selects all elements that are siblings
of a specified element. The following
example selects all <p>
elements that are siblings of <div>
elements:
+
selects all elements that are the
adjacent siblings of a specified
element. The following example will
select all <p>
elements that are placed immediately
after <div>
elements:
<head>
with a defer
attribute, or inside a DOMContentLoaded
event listener. Scripts that
manipulate DOM nodes should be
run after the DOM has been
constructed to avoid
errors.
document.getElementById()
and document.querySelector()
are common functions for
selecting DOM nodes.
innerHTML
property to a new value runs
the string through the HTML
parser, offering an easy way
to append dynamic HTML content
to a node.
==
and ===
?
===
) checks for strict equality, which
means both the type and value must be
the same. Double equals ( ==
) on the other hand first performs
type coercion so that both operands
are of the same type and then applies
strict comparison.
==
can have unintuitive
results.